<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1.0, user-scalable=no" />	
		<title>H5CASE—最优质的H5案例展示供应平台</title>
		<link rel="stylesheet" href="<%=path %>/wap/css/bootstrap.min.css" />
		<link rel="stylesheet" href="<%=path %>/wap/css/public.css" />
		<link rel="stylesheet" href="<%=path %>/wap/css/font-awesome.css" />
		<link rel="stylesheet" href="<%=path %>/wap/css/swiper.min.css" />
	</head>
	<body>
		<div class="tb-logo" style="">
	    	<span class="float-l pic" ><a href="<%=path %>/wap/index.html"><img src="<%=path %>/wap/img/logo.png" alt="" /></a></span>
	    	<div class="tb-srch">
		    	<span class="shuru"> &nbsp;搜索你想要的</span></span><!-- <input type="text" id="planName"/> -->
		    	<span class="fa fa-search btn" aria-hidden="true"></span>
		    </div>
	   </div>
	   <div class="ss-tc">
	   	    <div class="ss-tc-t">
	   	    	<span class="shuru">
	   	    		<input type="text" placeholder="搜索你想要的" id="planName"/>
	   	    		<a class="fa fa-search btn" aria-hidden="true" href="javascript:search();"></a>
	   	    	</span>
	   	    	<span>取消</span>
	   	    </div>
			 <div class="js">
	    	<span style="line-height: 22px;">项目检索</span>
	    	<span class="btn float-r">筛选</span>
	    	<div class="content">
	    		<div class="bd">
	    			<div class="mc">
	    				行业:
	    			</div>
	    			<div class="js-list">
				    	<div class="swiper-container ss">
			                <div class="swiper-wrapper text-center active-tab" id="industies">
			                    <div class="swiper-slide chose">全部</div>
			                    <c:forEach items="${industies }" var="item">
			                    	<div class="swiper-slide" code="${item.dicCode }">${item.dicName }</div>
			                    </c:forEach>
			                </div>
			            </div>
	                </div>
	    		</div>
	    		<div class="bd">
	    			<div class="mc">
	    				节日:
	    			</div>
	    			<div class="js-list">
				    	<div class="swiper-container">
			                <div class="swiper-wrapper text-center active-tab" id="holidays">
			                    <div class="swiper-slide chose">全部</div>
			                   	<c:forEach items="${holidays }" var="item">
			                    	<div class="swiper-slide" code="${item.dicCode }">${item.dicName }</div>
			                    </c:forEach>
			                </div>
			            </div>
	                </div>
	    		</div>
	    		<div class="bd">
	    			<div class="mc">
	    				功能:
	    			</div>
	    			<div class="js-list">
				    	<div class="swiper-container">
			                <div class="swiper-wrapper text-center active-tab" id="functions">
			                    <div class="swiper-slide chose">全部</div> 
								<c:forEach items="${functions }" var="item">
			                    	<div class="swiper-slide" code="${item.dicCode }">${item.dicName }</div>
			                    </c:forEach>
			                </div>
			            </div>
	                </div>
	    		</div>	    		
	    		<div class="bd">
	    			<div class="mc">
	    				排序:
	    			</div>
	    			<div class="js-list order-by">
				    	<div class="swiper-container">
			                <div class="swiper-wrapper text-center active-tab">
			                    <div class="swiper-slide chose four-word sort" code="hot">最具人气</div> 
								<div class="swiper-slide four-word sort" code="new">最新发布</div>								
			                </div>
			            </div>
	                </div>
	    		</div>
	    		<div class="btnx">
	    			<span class="cz">重置</span>
	    			<span class="qd">确定</span>
	    		</div>
	    	</div>
	    </div>
	   </div>	 
	   
	    <div class="zs-bd" id="cases">
		
		</div>
		<div class="jz-data">数据加载中...
			<input type="hidden" id="pageNo" name="pgNo" value="1" />
		</div>
		<!-- <div> .</div> -->
	    <%-- <div class="footer">
	    	<div class="footer-bd">
	    		<div class="we">
	    			<span>合作联系电话：13321889270</span>
			        <span><img src="<%=path %>/wap/img/xz-logo.png" alt="" width='5%'/></span>
	    		</div>
	    		<p class="bq">
	    			版权说明：网站所展示样例内容，均属于作者所有，由原作者拥有版权。未经版权方书面授权，请勿作他用，维权必究！
	    		</p>
	    	</div>
	    </div> --%>
	    <script type="text/javascript" src="<%=path %>/wap/js/jquery-2.2.3.min.js" ></script>
	    <script type="text/javascript" src="<%=path %>/wap/js/bootstrap.min.js" ></script>
	    <script type="text/javascript" src="<%=path %>/wap/js/swiper.min.js" ></script>
	    <script type="text/javascript" src="<%=path %>/wap/js/layer.js" ></script>
	    <script>
	    	var basePath = "${pageContext.request.contextPath }";
	    	var name = "${name}";
	    	var shuH=$('.zs-list .pic').width()*0.714;
	    	$('.zs-list .pic img').height(shuH);
            var flag=1;
            $('.js .btn').click(function(){
            	if(flag==1){
		            //执行方法;
		            $('.js .content').slideDown();
		            var mySwiper = new Swiper('.swiper-container',{
		                freeMode : true,
		                freeModeMomentum : false,
		                slidesPerView : 6,
		            });
		            $(".swiper-slide").click(function(){
		           	    $(this).addClass("chose").siblings().removeClass('chose');
		            });
		            flag=0;
		            $('.swiper-slide').each(function(){
		            	var textLength=$(this).text().length;
			            if(textLength == 2){
			            	$(this).width(25);
			            }else if(textLength == 3) {
			            	$(this).width(37);
			            }else if(textLength == 4){
			            	$(this).width(60);
			            }          
		            })
		        }else{
		            //执行方法;
		            $('.js .content').slideUp();
		            flag=1;
		        }
            });
           
            $('.js .content .btnx .cz').click(function(){
                $('.active-tab').each(function(){
            	    $(this).children('div:first').addClass("chose").siblings().removeClass('chose');
		        });
            })
            var ff = true;
            $('.js .content .btnx .qd').click(function(){
             	if(flag==0){
             		$('.js .content').slideUp();
             	}
             	$(".jz-data").css("display","block");
             	$(".zwsj").remove();
             	$(".zzz-list").remove();
             	$('.ss-tc').removeClass('ss-tc-show').addClass('ss-tc-hide');
             	$("#pageNo").val(1);
             	getDemo();
             	$(window).unbind('scroll');
             	
             	$(window).scroll(function(){
                	if($(window).scrollTop() + $(window).height() >= documentHeight && ff){   
                		ff=false;
                		pageChange();
                	}
                })
		    });
            
            window.onload = function () {
               var $activeHeight= $(".active-height").height();
                $(".active-content").height($activeHeight);
            };
            $('.tb-srch').click(function(){
            	$('.ss-tc').removeClass('ss-tc-hide').addClass('ss-tc-show');
            	var mySwiper = new Swiper('.swiper-container',{
	                freeMode : true,
	                freeModeMomentum : false,
	                slidesPerView : 6,
	            });
	            $(".swiper-slide").click(function(){
	           	    $(this).addClass("chose").siblings().removeClass('chose');
	            });
	            $('.swiper-slide').each(function(){
	            	var textLength=$(this).text().length;
		            if(textLength == 2){
		            	$(this).width(25);
		            }else if(textLength == 3) {
		            	$(this).width(37);
		            }else if(textLength == 4){
		            	$(this).width(60);
		            }          
	            })
            })
            $('.ss-tc-t span').eq(1).click(function(){
            	$('.ss-tc').removeClass('ss-tc-show').addClass('ss-tc-hide')
            })
	    </script>
	    <script type="text/javascript" src="<%=path %>/wap/js/index.js"></script>
	</body>
</html>

